.task-ctn-head {
    height: 136px;
    background: center/cover url("../../res/images/web/task/renwu bg@2x.png") no-repeat;
    text-align: center;
}

.bold {
    font-weight: 600;
}

.task-ctn-head-desc {
    width: 70%;
    text-align: center;
    margin: 14px auto 0;
    font-size:14px;
    font-weight:400;
    color:rgba(255,255,255,1);
    line-height:18px;
}

.friends-list-ctn {
    /*width: 100%;*/
    /*height: 247px;*/
    background: #fff;
    margin: -23px 8px 0;
    border-radius:4px;
    box-shadow:0px 2px 10px 0px rgba(0,0,0,0.1);
    box-sizing: border-box;
    padding: 16px;
}

.red-bag-list {
    margin-bottom: 22px;
    position: relative;
}

.red-bag-item {
    position: relative;
}

.invite-item {
    text-align: center;
    width: 20%;
    z-index: 1;
}

.invite-symbol {
    width:12px;
    height:12px;
    background:rgba(248,248,248,1);
    border-radius: 50%;
    margin: 8px auto;
}

.invite-symbol-invited {
    background:rgba(230,79,68,1);
}

.invite-result {
    width:52px;
    height:20px;
    background:rgba(248,248,248,1);
    border-radius:10px;
    text-align: center;
    margin: 0 auto;
}

.invite-result span {
    font-size:12px;
    font-weight:500;
    color:rgba(51,51,51,1);
    line-height:20px;
}

.invite-result-full {
    background: #FFA500;
}

.invite-result-full span {
    color: #fff;
}

.invite-symbol-full {
    background: #E64F44;
}



.red-bag-item span {
    position: absolute;
    left: 50%;
    bottom: 4px;
    transform: translateX(-50%);
    font-size:12px;
    font-weight:500;
    color:rgba(255,255,255,1);
    line-height:12px;
}

.task-title {
    font-size:16px;
    font-weight:600;
    color:rgba(51,51,51,1);
    line-height:22px;
    margin: 26px 16px 8px;
}

.task-list-ctn {
    margin: 0 8px;
}

.task-item-ctn {
    height:60px;
    background:rgba(255,255,255,1);
    /*border-radius:4px;*/
    margin-bottom: 1px;
    padding: 16px;
    box-sizing: border-box;
}
.task-item-ctn:first-of-type {
    border-radius: 4px 4px 0 0;
}
.task-item-ctn:last-of-type {
    border-radius: 0 0 4px 4px;
}

.task-item-title p {
    font-size:16px;
    font-weight:400;
    color:rgba(51,51,51,1);
    line-height:22px;
    margin-right: 4px;
}

.task-item-title span {
    font-size:12px;
    font-weight:400;
    color:rgba(158,158,158,1);
    line-height:17px;
}

.task-item-btn {
    width:64px;
    height:22px;
    background:rgba(250,114,104,1);
    border-radius:12px;
    text-align: center;
}

.task-item-btn-finished {
    background: rgba(248,248,248,1);
}

.task-item-btn span {
    width:36px;
    height:17px;
    font-size:12px;
    font-weight:500;
    color:rgba(255,255,255,1);
    line-height:22px;
}

.task-item-btn-finished span {
    color:rgba(141,141,141,1);
}

.task-item-coin {
    font-size:12px;
    font-weight:400;
    color:rgba(255,165,0,1);
    line-height:17px;
}
